import { createRouter, createWebHistory } from 'vue-router'
import HomeView from '../views/HomeView.vue'
import UserLoginPage from '@/pages/user/UserLoginPage.vue'
import UserRegisterPage from '@/pages/user/UserRegisterPage.vue'
import UserManagerPage from '@/pages/admin/UserManagerPage.vue'
import PictureManagerPage from '@/pages/admin/PictureManagerPage.vue'
import EditPicturePage from '@/pages/EditPicturePage.vue'
import PictureDetailPage from '@/pages/PictureDetailPage.vue'
import AddPictureBatchPage from '@/pages/AddPictureBatchPage.vue'
import SpaceManagerPage from '@/pages/admin/SpaceManagerPage.vue'
import EditSpacePage from '@/pages/EditSpacePage.vue'
import MySpacePage from '@/pages/MySpacePage.vue'
import SpaceDetailPage from '@/pages/space/SpaceDetailPage.vue'
import SpaceAnalyzePage from '@/pages/SpaceAnalyzePage.vue'

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
      path: '/',
      name: '主页',
      component: HomeView,
    },
    {
      path: '/user/login',
      name: '用户登录',
      component: UserLoginPage,
    },
    {
      path: '/user/register',
      name: '用户注册',
      component: UserRegisterPage,
    },
    {
      path: '/admin/userManager',
      name: '用户管理',
      component: UserManagerPage,
    },
    {
      path: '/edit_picture',
      name: '添加图片',
      component: EditPicturePage,
    },
    {
      path: '/edit_space',
      name: '创建空间',
      component: EditSpacePage,
    },
    {
      path: '/admin/pictureManager',
      name: '图片管理',
      component: PictureManagerPage,
    },
    {
      path: '/admin/spaceManager',
      name: '空间管理',
      component: SpaceManagerPage,
    },
    {
      path: '/picture/:id',
      name: '图片详情',
      component: PictureDetailPage,
      props: true,
    },
    {
      path: '/add_picture/batch',
      name: '批量创建图片',
      component: AddPictureBatchPage,
    },
    {
      path: '/space/:id',
      name: '空间详情',
      component: SpaceDetailPage,
      props: true,
    },
    // 注意：路由中的name一样会出问题
    {
      path: '/my_space',
      name: '我的空间',
      component: MySpacePage,
    },
    {
      path: '/space_analyze',
      name: '分析空间',
      component: SpaceAnalyzePage,
      props: true,
    },
    {
      path: '/about',
      name: 'about',
      // route level code-splitting
      // this generates a separate chunk (About.[hash].js) for this route
      // which is lazy-loaded when the route is visited.
      component: () => import('../views/AboutView.vue'),
    },
  ],
})

export default router
